<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib prefix="s" uri="/struts-tags" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>湖北包装网</title>
<link href="css/reset.css" rel="stylesheet" type="text/css" />
<link href="css/gird.css" rel="stylesheet" type="text/css" />
<link href="css/iehack.css" rel="stylesheet" type="text/css" />
<link href="css/header.css" rel="stylesheet" type="text/css" />
<link href="css/usercenter.css" rel="stylesheet" type="text/css" />
<style type="text/css">
/*
reset css version: 1.0 | 20090714
*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, legend, input, button, textarea, p, th, td {
	margin: 0;
	padding: 0;
}
fieldset, img {
	border: 0;
}
h1, h2, h3, h4, h5, h6 {
	font-size:100%;
}
ol, ul {
	list-style: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
caption, th {
	text-align: left;
	font-weight:normal;
}
:focus {
	outline: 0;
}
body {
	font-size:12px;
}
#bd {
	width:950px;
	margin:0 auto;
}
.reg .reg_info {
	background:#f6f6f6;
	border:#b0b0b0 1px solid;
	padding:15px 30px;
}
.reg .reg_info h2 {
	font-size:18px;
	line-height:30px;
	color:#16678c;
	border-bottom:3px solid #00d2ff;
}
.reg .reg_info h2 span {
	position:relative;
	float:right;
	top:0;
	color:#333;
	font-size:12px;
	font-weight:normal;
}
.reg .reg_info ul {
	padding:10px 60px;
}
.reg .reg_info li {
	position:relative;
	font-size:14px;
	line-height:48px;
}
.reg .reg_info li input {
	width:220px;
	border:1px solid #c6c6c6;
	line-height:20px;
	height:20px;
	font-size:14px;
	padding:2px;
	background:#FFF url(img/input.gif) 0 0 no-repeat;
}
.reg .reg_info .checkcode {
	width:80px;
}
.reg .reg_info .code_img {
	border:1px solid #E4E4E4;
	width:100px;
	height:36px;
	vertical-align: bottom;
	margin-left:10px;
}
.reg .reg_info .change_img {
	margin-left:10px;
	font-size:12px;
	vertical-align:middle;
}
.reg .reg_info .btn {
	text-align:center;
}
.reg .reg_info .btn button {
	background:url(img/reg_btn.jpg) no-repeat;
	width:183px;
	height:46px;
	border:0;
	cursor:pointer;
	text-indent:-999em;
}
.reg .reg_info .msg {
	font-size:12px;
	line-height:150%;
	position:absolute;
	top:14px;
	left:300px;
}
.reg .reg_info .msg p {
	padding:2px 10px 2px 23px;
	background:url(img/msg_bg.png) no-repeat;
}
.reg .reg_info .msg p.tips {
	background-position:3px -147px;
	border:1px solid #40b3ff;
	background-color:#e5f5ff;
	display:none;
}
.reg .reg_info .msg p.ok {
	background-position:3px -247px;
	width:50px;
	height:50px;
	display:none;
}
.reg .reg_info .msg p.error {
	background-position:3px 2px;
	border:1px solid #ff8080;
	background-color:#fff2f2;
}
.reg .agreements {
	background:#f6f6f6;
	border:#b0b0b0 1px solid;
	padding:10px 15px;
	margin-top:10px;
}
.reg .agreements h2 {
	color:#16678c;
	line-height:30px;
}
.reg .agreements div {
	background:#FFF;
	padding:10px;
	border:1px solid #E9E9E9;
	height:90px;
	overflow:auto;
}
.reg .agreements div p {
	line-height:200%;
	font-size:12px;
	text-indent:2em;
}
</style>
<script src="../js/jquery_last.js" type="text/javascript"></script>
<link type="text/css" rel="stylesheet" href="../js/style/validator.css"></link>
<script src="../js/formValidator.js" type="text/javascript" charset="UTF-8"></script>
<script src="../js/formValidatorRegex.js" type="text/javascript" charset="UTF-8"></script>
<script language="javascript" src="../js/DateTimeMask.js" type="text/javascript"></script>
<script defer="defer" src="../js/datepicker/WdatePicker.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
	//$.formValidator.initConfig({onerror:function(){alert("校验没有通过，具体错误请看错误提示")}});
	$.formValidator.initConfig({formid:"regform",onerror:function(msg){alert(msg)},onsuccess:function(){return true;}});
	$("#user_name").formValidator({onshow:"请输入用户名",onfocus:"请输入用户名",oncorrect:"正确"}).inputValidator({min:1,empty:{leftempty:false,rightempty:false,emptyerror:"用户名两边不能有空符号"},onerror:"用户名不能为空,请确认"});
	$("#password1").formValidator({onshow:"请输入密码",onfocus:"请输入密码",oncorrect:"密码合法"}).inputValidator({min:1,empty:{leftempty:false,rightempty:false,emptyerror:"密码两边不能有空符号"},onerror:"密码不能为空,请确认"});
	$("#checkcode").formValidator({onshow:" ",onfocus:"请输入验证码",oncorrect:"输入正确"}).inputValidator({min:1,empty:{leftempty:false,rightempty:false,emptyerror:"两边不能有空符号"},onerror:"验证码不能为空,请确认"})
	    .ajaxValidator({
	    type : "get",
		url : "../user/loginCheckCode.action?"+$("#checkcode").value,
		datatype : "json",
		success : function(data){	
            if( data == "0" )
			{
                return true;
			}
            else
			{
                return false;
			}
		},
		buttons: $("#button"),
		error: function(){alert("服务器没有返回数据，可能服务器忙，请重试");},
		onerror : "输入错误，请重新输入",
		onwait : "正在对验证码进行合法性校验，请稍候..."
	});
});

</script>
<script language="javascript"> 
/*验证码上刷新 */ 
function chk_image(){ 
document.getElementById("randImage").src  =  "image.jsp?" + Math.random();
} 
</script> 
</head>
<body>
<div class="page">
<jsp:include page="inc/header.jsp" />
<div id="bd" class="reg">
  <div class="reg_info">
  <form id="regform" name="regform" action="../user/UserLogin.action">
    <h2>用户登录<span>如果您未注册，请点此 <a href="web_reg.jsp">注册</a></span></h2>
     <div class="input">
          
            <table width="100%" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <th width="220">用户名：</th>
                <td width="250"><input name="webUser.user_name" type="text" id="user_name"/></td>
                <td><div id="user_nameTip"></div> </td>
              </tr>
              <tr>
                <th>密码：</th>
                <td><input name="webUser.user_password" type="password" id="password1"/></td>
                <td><div id="password1Tip"></div> </td>
              </tr>
              <tr>
                <th>验证码：</th>
                <td><input name="" type="text" class="checkcode" id="checkcode"/><img class="code_img" src="image.jsp" id="randImage" name="randImage" width="140" height="30" /><span class="change_img"><a href="javascript:chk_image();">换一张</a></span></td>
                <td><div id="checkcodeTip"></div></td>
              </tr>
              <tr>
	              <td></td>
	              <td><div><button type="submit">登录</button><div style="color: red;"><s:property value="tips"/> </div> </div></td>
	              <td></td>
              </tr>
            </table>
          </form>
        </div>
    
  </div>
  </div>
  <jsp:include page="inc/footer.jsp" />
</div>
</body>
</html>
